<template>
	<view>
		<view class="avatar">
			<image class="avatar-img" :src="userinfo.avatar" mode="widthFix"></image>
		</view>
		<u-form :labelStyle="{fontSize: '30rpx'}" :label-width="userId > 0 ? 140:200" label-position="left" ref="uForm" class="userinfo-form">
			<view v-if="userId > 0">
				<u-form-item label="ID">
					<text>{{userinfo.id}}</text>
				</u-form-item>
				<u-form-item label="昵称">
					<text>{{userinfo.nickname}}</text>
				</u-form-item>
				<u-form-item label="格言">
					<text>{{userinfo.bio}}</text>
				</u-form-item>
			</view>
			<view v-if="engineerId > 0">
				<u-form-item label="ID">
					<text>{{userinfo.id}}</text>
				</u-form-item>
				<u-form-item label="职称">
					<text>{{userinfo.title}}</text>
				</u-form-item>
				<u-form-item label="介绍">
					<text>{{userinfo.introduce}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.all_order_number" label="处理工单数">
					<text>{{userinfo.all_order_number}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.average_solve_time" label="平均解决时间">
					<text>{{userinfo.average_solve_time}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.average_first_response" label="平均首次响应">
					<text>{{userinfo.average_first_response}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.wx" label="微信号">
					<text>{{userinfo.wx}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.qq" label="QQ号">
					<text>{{userinfo.qq}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.mobile" label="手机号">
					<text>{{userinfo.mobile}}</text>
				</u-form-item>
				<u-form-item v-if="userinfo.email" label="邮箱">
					<text>{{userinfo.email}}</text>
				</u-form-item>
			</view>
		</u-form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0,
				userId: 0,
				engineerId: 0,
				userinfo: []
			}
		},
		onLoad(query) {
			var that = this
			that.id = query.id ? query.id:0
			that.userId = query.user_id ? query.user_id:0
			that.engineerId = query.engineer_id ? query.engineer_id:0
			that.load()
		},
		methods: {
			load: function () {
				var that = this
				that.$u.api.userInfo({
					id: that.id,
					user_id: that.userId,
					engineer_id: that.engineerId
				}).then(res => {
					if (res.code == 1) {
						that.userinfo = res.data.userinfo
					} else {
						that.$u.toast(res.msg);
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							})
						}, 2000)
					}
				}).catch(res => {
					that.$u.toast('请求失败，请重试！');
				})
			}
		}
	}
</script>

<style>
.avatar {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 60rpx 0;
}
.avatar-img {
	height: 160rpx;
	width: 160rpx;
	border-radius: 50%;
}
.userinfo-form {
	display: block;
	width: 92vw;
	margin: 0 auto;
}
</style>
